﻿<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="../../static/css/cloud-admin.css" >
	<link href="../../static/css/style.css" rel="stylesheet" type="text/css" media="all" />
	<link rel="stylesheet" type="text/css" href="../../static/css/iotxstyle.css" >
</head>
<body>
<!-- PAGE -->
<section>
	<!-- welcome -->
				<div class="col-md-4 col-md-offset-4">
					<div class="welcome-box-plain">
						<div class="guide">
							<div class="step-img">
								<div class="step-first" >
									<img src="../../static/img/step-1.png">
								</div>
								<div class="step-arrow">
									<img src="../../static/img/arrow-2.png">
								</div>
								<div class="step-second" >
									<img src="../../static/img/step-12.png">
								</div>
								<div class="step-arrow">
									<img src="../../static/img/arrow-1.png">
								</div>
								<div class="step-third" >
									<img src="../../static/img/step-23.png">
								</div>
								<div class="step-arrow">
									<img src="../../static/img/arrow-1.png">
								</div>
								<div class="step-forth" >
									<img src="../../static/img/step-24.png">
								</div>
							</div>
							<div class="stepdetail">
								<div class="stepdetail-one">
									Network Connection
								</div>
								<div class="stepdetail-two">
									User Information
								</div>
								<div class="stepdetail-three">
									Server Settings
								</div>
								<div class="stepdetail-four">
									Dusts Settings
								</div>
							</div>
							<div class="step-title">
								<div class="steptitle-one">
									Step 1
								</div>
								<div class="steptitle-two">
									Step 2
								</div>
								<div class="steptitle-three">
									Step 3
								</div>
								<div class="steptitle-four">
									Step 4
								</div>
							</div>
							<div class="step-line">
								<img src="../../static/img/step-line.png" style="width: 97%">
							</div>
						</div>
							<div class="connect">
								<div class="guideinfoimg" >
									<img src="../../static/img/network-connection.png">
								</div>

								<div class="guideinfodetail">
									<form role="form">
										<div class="form-group">
											<label for="exampleInputEmail1" style="font-size: 16px;font-weight: 600">Company</label>
											<input class="form-control" value="{{ userData['company_name'] }}" style="margin: 0px;float: inherit;width:100%;height: 45px" id="exampleInputEmail1" placeholder="Please enter" >
										</div>
										<div class="form-group">
											<label for="exampleInputEmail1" style="font-size: 16px;font-weight: 600">Address</label>
											<input class="form-control" value="{{ userData['company_address'] }}" style="margin: 0px;float: inherit;width:100%;height: 45px"  placeholder="Please enter" >
										</div>
										<div class="form-group">
											<label for="exampleInputEmail1" style="font-size: 16px;font-weight: 600">User Name</label>
											<input class="form-control" value="{{ userData['user_name'] }}" style="margin: 0px;float: inherit;width:100%;height: 45px"  placeholder="Please enter" >
										</div>
										<div class="form-group">
											<label for="exampleInputEmail1" style="font-size: 16px;font-weight: 600">Equipment Name</label>
											<input class="form-control" value="{{ userData['device_no'] }}" style="margin: 0px;float: inherit;width:100%;height: 45px"  placeholder="Please enter" >
										</div>
										<div class="form-group">
											<label for="exampleInputEmail1" style="font-size: 16px;font-weight: 600">Equipment ID</label>
											<input class="form-control" value="{{ userData['device_id'] }}" style="margin: 0px;float: inherit;width:100%;height: 45px"  placeholder="Please enter" >
										</div>

									</form>


								</div>

							</div>
							<div class="next">
								<button id="upbutton" class="upbutton">PREVIOUS</button>
								<button id="nextbutton" class="nextbutton">NEXT</button>
							</div>

					</div>
				</div>
	<!--/welcome -->
</section>
<!--/PAGE -->
<!-- JAVASCRIPTS -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- JQUERY -->
<script src="../../static/js/jquery-2.0.3.min.js"></script>
<!-- JQUERY UI-->
<script src="../../static/js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
<!-- BOOTSTRAP -->
<script src="../../static/bootstrap-dist/js/bootstrap.min.js"></script>
<!-- CUSTOM SCRIPT -->
<script src="../../static/js/script.js"></script>
<script>
    jQuery(document).ready(function() {
		$('#upbutton').click(function(){
			window.location.href='/guide/guide';
		});
        $('#nextbutton').click(function(){
            window.location.href='/guide/settingup';
        });

    });
</script>
</body>
</html>